<template>
  <a-modal
        :title="title"
        :width="560"
        :visible="visible"
        :body-style="{paddingBottom: '100px'}"
		:dialogStyle="{top:'50px'}"
		:maskClosable="false"
         @ok="onOk"
         @cancel="onCancel"
  >
	<a-form-model ref="liForm" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="rules">
		<a-form-model-item label="id" v-show="false">
		  <a-input v-model="form.id" />
		</a-form-model-item>
				<a-form-model-item label="调整干部" prop="leaderInfoId" >
				  <a-select
				      show-search
				      v-model="form.leaderInfoId"
				      placeholder="请输入干部编号/姓名"
				      :default-active-first-option="false"
				      :show-arrow="false"
				      :filter-option="false"
				      :not-found-content="null"
				      @search="handleSearch"
				      @change="handleChange"
				    >
				      <a-select-option v-for="obj in leaderdata" :value="obj.id" :key="obj.id">
				       {{ obj.code }} - {{ obj.name }}
				      </a-select-option>
				    </a-select>
				</a-form-model-item>
				<a-form-model-item label="挂职类别" prop="category" >
				  <a-select v-model="form.category" placeholder="请输入挂职类别">
				    <a-select-option  v-for="(obj, index) in categorydata" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
				  </a-select>
				</a-form-model-item>
				<a-form-model-item label="挂职渠道" prop="channel" >
				  <a-select v-model="form.channel" placeholder="请输入挂职渠道">
				    <a-select-option  v-for="(obj, index) in channeldata" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
				  </a-select>
				</a-form-model-item>
				<a-form-model-item label="挂职部门" prop="departmentId">
					<a-tree-select
						placeholder="请输入挂职部门"
					   :getPopupContainer="selecetPosition"
						v-model="form.departmentId"
						:tree-data="dpttreeData"
					  />
				</a-form-model-item>
				<a-form-model-item label="挂职职务" prop="position">
					<a-select v-model="form.position" placeholder="请输入挂职职务">
					  <a-select-option  v-for="(obj, index) in positionData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
					</a-select>
				</a-form-model-item>
				<a-form-model-item label="挂职时间" prop="temporaryPostDate">
					<a-date-picker v-model="form.temporaryPostDate" valueFormat="YYYY-MM-DD" placeholder="请输入挂职时间时间" :style="{width:'100%'}"/>
				</a-form-model-item>
				
				<a-form-model-item label="挂职情况" >
				  <a-input v-model="form.comment" placeholder="请输入挂职情况"/>
				</a-form-model-item>
		</a-form-model>
  </a-modal>
</template>

<script>
import {getUrl} from '@/api/manage'
export default {
  components:{
   
  },
  name:"TemporaryPostInfoForm",
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    loading: {
      type: Boolean,
      default: () => false
    },
    model: {
      type: Object,
      default: () => null
    },
    title: {
      type: String,
      default : ''
    }
  },
  data () {
    return {
      labelCol: { span: 6 },
      wrapperCol: { span:14 },
	  selecetPosition : triggerNode => {return triggerNode.parentNode || document.body;},
      form: {
          id:'',
          leaderInfoId: undefined,
          category: undefined,
          channel: undefined,
		  departmentId:undefined,
		  position:undefined,
		  temporaryPostDate:'',
		  comment:''
      },
	  leaderdata:[],
	  categorydata:[],  
	  dpttreeData:[],
	  positionData:[],
	  channeldata:[],
      rules: {
        leaderInfoId: [
          {required: true, message: '挂职干部不能为空', trigger: 'change' },
         
        ],
        category: [
          {required: true, message: '挂职类别不能为空', trigger: 'change' },
          
        ],
        channel: [
          {required: true, message: '挂职渠道不能为空', trigger: 'change' },
          
        ],
		departmentId: [
			{required: true, message: '挂职部门不能为空', trigger: 'change' },
			
		],
		position: [
			{required: true, message: '挂职职务不能为空', trigger: 'change' },
		],
		temporaryPostDate: [
			{required: true, message: '挂职职务不能为空', trigger: 'change' },
		],
      },
    }
  },
  created () {
    // 当 model 发生改变时，为表单设置值
    this.$watch('model', () => {
      Object.assign(this.form, this.model)
    })
  },
  methods: {
	fetch(value){
		var _this = this
		getUrl('leaderInfo/listbyname', {name:value})
		  .then(res => {
		    console.log(res)
		    _this.leaderdata = res.result
		})
	},
	handleSearch(value) {
		this.fetch(value);
	},
	handleChange(value) {
		console.log(value);
		this.value = value;
		this.fetch(value);
	},
    onCancel() {
       this.$emit("cancel",this)
    },
    onOk() {
       this.$emit("ok",this)
    }
  }
}
</script>
<style>
</style>
